<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>流程管理 - 下一步</title>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta http-equiv="Expires" CONTENT="0">
    <meta http-equiv="Cache-Control" content="no-siteapp,no-transform,no-store, no-cache, must-revalidate">
    <meta http-equiv="Pragma" content="no-cache">
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"/>
    <link rel="stylesheet" href="/static/css/font.css">
    <link rel="stylesheet" href="/static/css/weadmin.css">
    <link rel="stylesheet" href="/static/css/buildUnit/common.css">
    <script type="text/javascript" src="/lib/layui/layui.js" charset="utf-8"></script>
    <script src="/lib/jquery/jquery.js"></script>
    <script src="/static/js/main.js"></script>
</head>
<body>
<form class="layui-form" action="" lay-filter="example">
<div style="margin: auto 20px;">
    <table id="table" class="layui-table">
        <thead>
        <tr>
            <th>业务办理下一阶段：</th>
            <th>选择办理人：</th>
        </tr>
        </thead>
        <tbody class="tbody">
        </tbody>
    </table>
    <br>办理意见：<br>
    <textarea name="comments" placeholder="请输入内容" required class="layui-textarea"></textarea>
</div>
</form>
</body>

<script type="text/javascript">
    function initNext() {
        var html = '';
        top.processOutputCtx.activities.forEach(function (activiti) {
            html += '<tr id="taskDefKey">';
            html += '<td><input type="radio" class="radio" name="taskDefKey"  lay-filter="taskDefKey" value="'+ activiti.id +'" passName="'+ activiti.name+'" taskDefType="'+ activiti.type+'" title="'+ activiti.name+'"></td>';
            html += '<td>';
            activiti.participants.forEach(function (participant) {
                html +='<input type="checkbox" class="radio_'+ activiti.id +'" name="checkbox" lay-filter="checkbox" value="'+participant.id+'" lay-skin="primary" title="'+ participant.name+'"></br>'
            });
            html += '</td>';
            html += '</tr>';
        });
        $(".tbody").append(html);

        layui.use(['configureCom','jquery', 'allHeight', 'element', 'form'], function () {
            var form = layui.form;
            var $ = layui.jquery;
            form.on('radio(taskDefKey)', function(data){
                $("input[name=checkbox]").prop("checked", false);
                var item =$("."+$(this).parent().parent().find("input[name=checkbox]").prop("className"));//获取多选框的中class
                item.each(function () {
                    if ($(this).prop("checked")) {
                        $(this).prop("checked", false);
                    } else {
                        $(this).prop("checked", true);
                    }
                });
                form.render('checkbox')
            });
        });

    } // initNext() End


    /**
     * 初始化父页面获取人员参数的方法
     *
     * @return {[type]} [description]
     */
    top.getParticipantsVariables = function () {


        // 获取选中的 radio 数组
        var pass = $('input:radio:checked');
        // 获取选中radio 对应的候选人数组
        var participants = getParticipants(pass.val());
        //构建
        var radios = $(".radio");
        var variables = [];
        for (var i = 0; i < radios.length; i++) {
            variables.push({
                name: radios[i].value,   								// taskDefKey
                value: radios[i].checked ? participants : "false"		// 对应的人员的ID
            });
        }
        // if ('End' == pass.attr('passName')) {
        //     return [];
        // }
        if ('endEvent' == pass.attr('taskDefType')) {
            return variables;
        }
        if (pass.length == 0) {
            top.layer.msg("请选择下一步任务！");
            return undefined;   //父页面会解析返回值，返回值若 undefined 阻塞页面
        }

        if (participants == "") {
            top.layer.msg("请在选中的任务下勾选至少一个任务责任人！");
            return undefined;
        }

        return variables;
    };

    /**
     * 通过 radio 获取 checkbox 中被选中的人员
     */
    function getParticipants(taskDefKey) {
        var participants = "";
        var checkboxes = $(".radio_" + taskDefKey);
        for (var j = 0; j < checkboxes.length; j++) {
            participants += (checkboxes[j].checked ? "," + checkboxes[j].value : "");
        }
        return participants != "" ? participants.substring(1) : "";
    }


    /**
     * 初始化获取父页面获取意见的方法
     * @return {[type]} [description]
     */
    top.getOpinion = function () {
        var pass = $('input:radio:checked');
        return {
            "pass": pass.val(),
            "passName": pass.attr('passName'),
            "comments": $("textarea[name='comments']").val()
        };
    }
</script>

<script type="text/javascript">
    initNext();
</script>
</html>